<div id="upload-form" style="margin-top:5px;">
  <ul>
    <li><a href="#upload-tab">Upload</a></li>
  </ul>
  <div id="upload-tab">
    <h2>File Upload</h2>
    <div id="error-msg">
      <p><%= @error_msg %></p>
    </div>
    FreeMindファイル(*.mm)からプレゼンテーションを作成します。
    <form id="upform" method="POST" action="/presentation.html" enctype="multipart/form-data">


      <input id="file-select" type="file" name="file"/>
      <input id="upload-btn" type="submit" value="upload"/>
      <div id="form-msg">&nbsp;</div>
      <h3 id="options" class="clickable">Options (click to expand)</h3>
      <div id="option_section">
	<!--
	<h4>Theme</h4>
	<p>
	  <span>テーマ</span>
	  <select name="template">
	    <option value="default" selected="true">Blue(default)</option>
	    <option value="black">Black</option>
	    <option value="Silver">Silver</option>
	  </select>
	</p>
	-->
	<h4 id="metadata" class="with-help">Metadata</h4>
	プレゼンテーションに関するデータを入力します。<br/>
	<span>著者名</span>
	<input type="text" name="author" size="20" /><br />

	<span>所属</span>
	<input type="text" name="company" size="20" /><br />
	<span>日付</span>
	<input type="text" id="datepicker" name="presdate" size="10" /><br/>
	<h4>Miscellaneous</h4>
	<input id="target_blank" type="checkbox"/>
	プレゼンテーションを新規ウィンドウで表示する
      </div><!-- options -->
    </form>
  </div>
</div>
<div id="menu-tabs" style="margin-top:5px;">
  <ul>
    <li><a href="#tabs-1">What's this?</a></li>
    <li><a href="#tabs-2">Quick Start</a></li>
    <li><a href="#tabs-3">Tips</a></li>
    <li><a href="#tabs-4">Links</a></li>
  </ul>
  <div id="tabs-1">
    <h2>これは何？</h2>
    <p>
      <a href="http://freemind.sourceforge.net/wiki/index.php/Main_Page">FreeMind</a>
      ファイルから、プレゼンテーションを作成するアプリケーションです。</p>
    <h2>どう使う？</h2>
    <p>
      <a href="http://freemind.sourceforge.net/wiki/index.php/Main_Page">FreeMind</a>
      ファイル(*.mm)を上のアップロードフォームからアップロードします。
      その場で、パワーポイントのようなプレゼンテーション資料が作成されます。
    </p>
    <h2>アップロードしたファイルはどうなるの？</h2>
    <p>
      アップロードしたファイルは保存されませんのでご安心下さい。
      ただし、センシティブな情報を含むファイルのアップロードはお避け下さい。
    </p>
  </div>
  <div id="tabs-2">
    <h2>シンプルなプレゼンテーション例</h2>
    <p>
      <a href="/samples/simple-example-src_ja.mm">このようなFreeMindファイル</a>をつくります。
      (右クリックでダウンロード)<br/>
      <img id="simple-example-img" style="width:100px;height:50px;" src="samples/simple-example-src_ja.png"/>
      (クリックして拡大)<br/>
    </p>
    <p>
      このようなプレゼンテーションになります。<br/>
      <a target="_blank" href="/samples/simple-example-dest_ja.html">
	<img src="/samples/simple_example-dest_ja.png"/>
      </a>
      (クリックしてサンプルを表示)
    </p>
  </div>
  <div id="tabs-3">
    <h2>Tips</h2>
    <p>
      <a href="/samples/tips-src_ja.mm">このようなFreeMindファイル</a>をつくります。
      (右クリックでダウンロード)<br/>
      プレゼンテーションにテーブルやイメージを挿入したり、
      ハイライトをつけることができます。<br/>
      <img id="tips-img" style="width:100px;height:50px;" src="/samples/tips-src_ja.png"/>
      (クリックして拡大)<br/>
      このようなプレゼンテーションになります。<br/>
      <a target="_blank" href="/samples/tips-dest_ja.html">
	<img src="/samples/tips-dest_ja.png"/>
      </a>
      (クリックしてサンプルを表示)
    </p>
  </div>
  <div id="tabs-4">
    <h2>Thanks to...</h2>
    <ul>
      <li><a href="http://freemind.sourceforge.net/wiki/index.php/Main_Page">
	  FreeMind
      </a></li>
      <li><a href="http://meyerweb.com/eric/tools/s5/">S5</a></li>
      <li><a href="http://code.google.com/p/mm2s5/">mm2s5 (Original)</a></li>
      <li><a href="http://www.ixedit.com/">IxEdit</a></li>
    </ul>
    <h2>My Blog...</h2>
    <ul>
      <li><a href="http://d.hatena.ne.jp.fuzzehad/">砂漠の音楽</a></li>
    </ul>
  </div>
</div><!-- menu-tabs -->

<div id="hidden-area" style="display:none;">
  <div id="dialog1" title="かんたんな例"><img src="/samples/simple-example-src_ja.png"/></div>
  <div id="dialog2" title="Tips"><img src="/samples/tips-src_ja.png"/></div>
</div>
<script type="text/javascript">
$(document).ready(function(){
    $('#upform').submit(function() {
	var filename = $('#file-select').attr('value');
	if (filename == null || filename.length == 0) {
	    alert("ファイルが指定されていません。");
	    return false;
	}
    });
    $('#target_blank').click(function() {
        var tgt = this.checked ? '_blank' : 'self';
        $('#upform').attr('target', tgt);
    });
});
</script>

